<!DOCTYPE HTML>
<html>
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0"/>
    <meta name="format-detection" content="telephone=no,email=no,date=no,address=no">
    <title>AUI快速完成布局</title>
    <link rel="stylesheet" type="text/css" href="../css/aui.css" />
    <style type="text/css">
        .goods-title {
            color: #757575 !important;
        }
        .goods-price {
            color: #666666 !important;
            font-weight: 700;
        }
        [v-cloak] {
          display: none;
        }
    </style>
</head>
<body>
<div id="app" v-cloak>
    <section class="aui-content">
        <div v-for="item in papers" class="aui-card-list aui-border-t aui-border-b">
            <div class="aui-card-list-header aui-card-list-user">
                <div class="aui-card-list-user-avatar">
                    <img src="../image/demo1.png">
                </div>
                <div class="aui-card-list-user-name">
                    <div class="aui-font-size-16">考试编号：{{item.paperid}} <i class="aui-iconfont aui-icon-right aui-font-size-12"></i></div>
                    <small>结束时间:{{item.endtime}}</small>
                </div>
                <div class="aui-card-list-user-info">{{item.papercreatetime}}</div>
            </div>
            <div class="aui-card-list-content aui-border-t" style="margin-left: 3.5rem;">
            </div>
            <div class="aui-card-list-footer aui-border-t">

                <div>
                  <div v-if="isDown(item.paperid)" class="aui-btn aui-btn aui-btn-outlined aui-btn-warning">已经结束</div>
                  <div v-else-if="isEnd(item.endtime)" class="aui-btn aui-btn aui-btn-outlined aui-btn-info">已经完成</div>
                  <div @click="toPaper(item.paperid)" v-else class="aui-btn aui-btn aui-btn-outlined aui-btn-info">正在进行中...</div>

                </div>
            </div>
        </div>


<!-- *************************s -->
        <div class="aui-card-list aui-border-t aui-border-b">
            <div class="aui-card-list-footer aui-border-t">
                <div>
                    <div @click="getPaper(user.usertotea);getDownPaper(user.userid)" class="aui-btn aui-btn aui-btn-outlined aui-btn-info">...刷新一下...</div>
                </div>
            </div>
        </div>


    </section>
  </div>
</body>
<script type="text/javascript" src="../script/api.js"></script>
<script type="text/javascript" src="../script/vue.js"></script>
<script type="text/javascript" src="../script/jquery-1.12.4.min.js"></script>
<script type="text/javascript" src="../layer/layer.js"></script>
<script type="text/javascript" src="../script/init.js" ></script>

<script type="text/javascript">
var user = JSON.parse(localStorage.getItem('user'))
var index=""
    var app03 = new Vue({
      el:'#app',
      data:{
        papers:[],
        ans:[],
        num:0,
        time:0,
        user:user


      },
      created:function () {
        this.getPaper(user.usertotea)
        this.getDownPaper(user.userid)
      },
      methods:{
        isDown(paperid) {
          var res = this.ans.filter((item,index)=>{
            return  item.testpaperid === paperid
          })

          return res.length

        },
        isEnd(date){
          var date = new Date(date).getTime()
          var nowDate = new Date().getTime()
          if(date - nowDate > 0){
            return false
          }
          return true
        },
        getPaper (id) {
          index = layer.load();
          $.ajax({
          url:bashUrl+`paper/${id}`,
          type:"get",
          data:"",
          timeout:3000,
          dataType:"json",
          success:(data)=>{
            layer.close(index)
            this.papers = data.papers.reverse()
          },
          error: function () {
            layer.close(index)
            api.toast({msg:"请求超时或繁忙",duration : 2000})
          }
          });
        },
        getDownPaper (id) {

          $.ajax({
          url:bashUrl+`an/${id}`,
          type:"get",
          data:"",
          timeout:5000,
          dataType:"json",
          success:(data)=>{
            layer.close(index)
            this.ans=data.ans
          },
          error: function () {
            layer.close(index)
            api.toast({msg:"请求超时或繁忙",duration : 2000})
          }
          });
        },
        toPaper (id) {
          api.openWin({
              name: 'paper',
              url: './paper.html',
              pageParam: {
                  paperid: id
             }
          });
        }
      }
    })




    apiready = function () {
      api.addEventListener({
          name:'viewappear'
      }, function(ret, err){
        app03.getPaper(user.usertotea)
        app03.getDownPaper(user.userid)
      });

    }
</script>
</html>
